// 该文件用于创建整个应用的路由

// (1) vueRouer相当于router的构造函数，就跟Vuex.Store是store构造函数一样
import vueRouter from "vue-router";

import About from "../pages/About";
import Home from "../pages/Home";
import Message from "../pages/Message";
import News from "../pages/News";
import Detail from "../pages/Detail";


export default new vueRouter({
  // (2) routes复数，存放所有路由
  routes: [
    {
      path: "/about",
      component: About,
    },
    {
      path: "/home",
      component: Home,
      // (3) 子路由不需要加/因为写子路由说明后面有地址要写，就给你加上了
      children:[
        {
          // (4) 注意是component不是components，一个路由只对应一个组件。因此不是复数
          path:"message",
          component: Message,
          children:[
            {
              // (5) 当路由层级较多时，要写name属性，这样写地址的时候直接用name就行(必须得用to的对象形式)
              name:'detail',
              path: "detail/:id/:title",
              component: Detail,
            }
          ]
        },
        {
          path:"news",
          component: News
        },
      ]
    },
  ],
});
